<template>
  <div id="container">
    <div class="container"></div>
    <video
      id="myVideo"
      autoplay
      controls
      loop
      width="640"
      height="320"
      style="display: none"
      crossOrigin="anonymous"
    />
  </div>
</template>

<script>
// import { init, animate } from "./index";

// import * as Three from 'three'
export default {
  mounted() {
//     const dom = document.querySelector(".container");
//     console.log(24, dom);
//     init(dom);
//     animate();
  },
  methods: {
    //    of init
  },
  setup() {},
};
</script>

<style>
#container {
  position: fixed;
  left: 0;
  top: 0;
  background: #ccc;
  font-size: 80%;
  font-weight: lighter;
  background: radial-gradient(#1a5970 0%, #000 100%);
  overflow: hidden;
}
canvas {
  -webkit-filter: drop-shadow(0 0 3em black);
  filter: drop-shadow(0 0 3em black);
}

video#myVideo {
  position: absolute;
  top: 0;
}
</style>